<template>
	<view class="login">
		<view class="form">
			<view class="login-top">
				<view class="loginText">
					<view class="image-box">
						<image style="width: 108upx;height: 108upx;" src="@/static/index/l.png" alt />
					</view>
					<h2>浙江高信标准版</h2>
				</view>
			</view>
			<view class="login-mid">
				<view v-if="show">
					当前用户暂无权限
				</view>
			</view>
			<view class="login-bot">

			</view>
			<loading :shadeShow="shadeShow" :shadeClick="false" :backgroundColor="backgroundColor" :width="width"
				:height="height" ref="loadings" :custom="false" :type="1" @callback="callback">

			</loading>
			<view class="bottom">
				<view class="text">技术支持: 浙江高信技术股份有限公司</view>
			</view>
		</view>
	</view>
</template>

<script>
	import loading from '@/components/xuan-loading/xuan-loadings.vue'

	import {
		mapMutations
	} from 'vuex';
	export default {
		components: {
			loading
		},
		data() {
			return {
				width: '150rpx',
				height: '100rpx',
				shadeShow: true,
				backgroundColor: "transparent",
				themeColor: '#525EF9',
				logoUrl: '../../static/l.png',
				pathUrl: "http://1.14.19.236:8001/fileAnnexes/inspection.apk",
				show: false,
				Wechat: null
			}
		},
		onLoad() {
			let that = this;
			that.show = false;
			// console.log("window", window.location.href);
			// console.log("openId", window.location.href.split("=")[1]);
			that.Wechat = window.location.href.split("=")[1];
			setTimeout(() => {
				that.getUserInfo(that.Wechat);
			}, 200);
		},

		methods: {
			getUserInfo(e) {
				this.$refs.loadings.open();
				this.$http.getUserByOpenid({
					fWechat: e, // openid
				}).then(res => {
					// uni.showToast({
					// 	title: window.location.href+";;;;;;;errcode:"+res.errcode, 
					// 	icon: 'none',
					// 	duration: 4000
					// });
					if (res.errcode == 0) {
						setTimeout(() => {
							// this.$refs.loadings.close();
							uni.reLaunch({
								url: '/pages/home/index?Wechat=' + e
							});
							uni.setStorage({
								key: 'userInfo',
								data: JSON.stringify(res.data.userInfo)
							});
							uni.setStorage({
								key: 'role',
								data: JSON.stringify(res.data.rolemap)
							});
							uni.showToast({
								title: "登录成功",
								icon: 'none',
								duration: 2000
							});

						}, 3000);
					} else if (res.errcode == -1) {
						setTimeout(() => {
							// this.$refs.loadings.close();
							uni.showToast({
								title:res.msg,
								icon: 'none',
								duration: 2000
							});
							uni.reLaunch({
								url: "/pages/index/register?Wechat=" + e
							})
						}, 3000);
					} else if (res.errcode == -2) {
						setTimeout(() => {
							this.$refs.loadings.close();
							this.show = true;
						}, 3000);
					} else {
						setTimeout(() => {
							uni.showToast({
								title: res.data.loginMsg,
								icon: 'none',
								duration: 2000
							});
							// this.$refs.loadings.close();

						}, 2000)
						return false;
					}
				}, (err) => {
					uni.showToast({
						title: "获取用户信息接口报错",
						icon: 'none',
						duration: 2000
					});
				})
			},

			callback() {
				console.log("关闭后回掉");
			}
		}
	}
</script>

<style scoped>
	.image-box {}

	.login {
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		width: 100%;
		background-image: url(../../static/index/board.png);
		background-size: 100% 100%;
		text-align: center;
		color: rgb(204, 204, 204);
		overflow: hidden;
	}

	.form {
		height: 100%;
		position: relative;
		width: 100%;
		display: flex;
		flex-direction: column;
	}

	.login-top {
		flex: 2;
		position: relative;
	}

	.login-top .loginText {
		position: absolute;
		width: 99%;
		transform: translate(-50%, -50%);
		top: 77%;
		left: 50%;
	}



	.login-top h2 {
		margin-top: 50upx;
		color: #171A1D;
		font-weight: 600;
		font-size: 40upx;
		letter-spacing: 4upx;
	}

	.login-mid {
		flex: 3;
		position: relative;
		display: flex;
		justify-content: center;
		align-items: center;
		/* font-weight: 600; */
		font-size: 40upx;
		letter-spacing: 4upx;
		color: #171A1D;
	}


	.login-bot {
		flex: 1;
		width: 100%;
		position: relative;
	}

	.bottom {
		font-size: 0.9rem;
		flex: 1;
		position: relative;
	}

	.bottom .text {
		position: absolute;
		width: 98%;
		font-size: 28upx;
		transform: translate(-50%, -50%);
		top: 65%;
		left: 50%;
		color: #9C9FA4;
	}

	.test {
		animation: 1s aaa infinite;
	}

	@keyframes aaa {
		from {
			transform: rotate(0deg);
		}

		to {
			transform: rotate(360deg);
		}
	}
</style>
